<!doctype html>
<html lang="en" xml:lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=8,IE=9,IE=10" />
    <!-- ticket #4555 -->
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
    />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <link href="./transmission-app.css" rel="stylesheet" />
    <link href="./images/favicon.ico" rel="icon" />
    <link href="./images/favicon.png" rel="shortcut icon" />
    <link rel="apple-touch-icon" href="./images/webclip-icon.png" />
    <script type="text/javascript" src="./transmission-app.js"></script>
    <title>Transmission Web Interface</title>
  </head>
  <body>
    <div id="app"></div>
    <div id="mainwin">
      <header class="mainwin-toolbar" id="mainwin-toolbar">
        <button
          aria-keyshortcuts="Alt+O"
          aria-label="Open torrent"
          class="toolbar-button"
          data-action="open-torrent"
          id="toolbar-open"
          tabindex="0"
        >
          <svg
            xmlns="http://www.w3.org/2000/svg"
            width="32"
            height="32"
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2"
            stroke-linecap="round"
            stroke-linejoin="round"
            class="feather feather-folder-plus toolbar-icon"
          >
            <path
              d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"
            ></path>
            <line x1="12" y1="11" x2="12" y2="17"></line>
            <line x1="9" y1="14" x2="15" y2="14"></line>
          </svg>
        </button>
        <button
          aria-keyshortcuts="Alt+Delete"
          aria-label="Remove selected torrents"
          class="toolbar-button"
          data-action="remove-selected-torrents"
          id="toolbar-remove"
          tabindex="0"
        >
          <svg
            xmlns="http://www.w3.org/2000/svg"
            width="32"
            height="32"
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2"
            stroke-linecap="round"
            stroke-linejoin="round"
            class="feather feather-trash-2 toolbar-icon"
          >
            <polyline points="3 6 5 6 21 6"></polyline>
            <path
              d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
            ></path>
            <line x1="10" y1="11" x2="10" y2="17"></line>
            <line x1="14" y1="11" x2="14" y2="17"></line>
          </svg>
        </button>
        <div class="toolbar-separator"></div>
        <button
          aria-keyshortcuts="Alt+R"
          aria-label="Resume selected torrents"
          class="toolbar-button"
          data-action="resume-selected-torrents"
          id="toolbar-start"
          tabindex="0"
        >
          <svg
            xmlns="http://www.w3.org/2000/svg"
            width="32"
            height="32"
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2"
            stroke-linecap="round"
            stroke-linejoin="round"
            class="feather feather-play"
          >
            <polygon points="5 3 19 12 5 21 5 3"></polygon>
          </svg>
        </button>
        <button
          aria-keyshortcuts="Alt+P"
          aria-label="Pause selected torrents"
          class="toolbar-button"
          data-action="pause-selected-torrents"
          id="toolbar-pause"
          tabindex="0"
        >
          <svg
            xmlns="http://www.w3.org/2000/svg"
            width="32"
            height="32"
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2"
            stroke-linecap="round"
            stroke-linejoin="round"
            class="feather feather-pause"
          >
            <rect x="6" y="4" width="4" height="16"></rect>
            <rect x="14" y="4" width="4" height="16"></rect>
          </svg>
        </button>
        <div class="toolbar-separator"></div>
        <button
          aria-keyshortcuts="Alt+I"
          aria-label="Toggle inspector"
          class="toolbar-button"
          data-action="show-inspector"
          id="toolbar-inspector"
          tabindex="0"
        >
          <svg
            version="1.1"
            xmlns="http://www.w3.org/2000/svg"
            xmlns:xl="http://www.w3.org/1999/xlink"
            xmlns:dc="http://purl.org/dc/elements/1.1/"
            viewBox="-1 -1 26 26"
            fill-opacity="1"
            stroke="currentColor"
            fill="none"
            width="26"
            height="26"
          >
            <g>
              <circle
                cx="12"
                cy="12"
                r="12.0000191748228"
                stroke-linecap="round"
                stroke-linejoin="round"
                stroke-width="2"
              />
              <path
                class="inspector-icon"
                d="M 11.88208 4.883789 C 12.326418 4.883789 12.702391 5.039305 13.01001 5.350342 C 13.317628 5.6613785 13.471436 6.035642 13.471436 6.4731445 C 13.471436 6.910647 13.31592 7.283202 13.004883 7.59082 C 12.693846 7.898439 12.319582 8.052246 11.88208 8.052246 C 11.444578 8.052246 11.072023 7.898439 10.764404 7.59082 C 10.456786 7.283202 10.302979 6.910647 10.302979 6.4731445 C 10.302979 6.035642 10.456786 5.6613785 10.764404 5.350342 C 11.072023 5.039305 11.444578 4.883789 11.88208 4.883789 Z M 13.317627 9.528809 L 13.317627 17.126953 C 13.317627 17.803714 13.39624 18.236083 13.553467 18.424072 C 13.710694 18.612061 14.018308 18.719726 14.476318 18.74707 L 14.476318 19.11621 L 9.298096 19.11621 L 9.298096 18.74707 C 9.721926 18.733398 10.036376 18.610353 10.241455 18.37793 C 10.378175 18.220702 10.446533 17.803714 10.446533 17.126953 L 10.446533 11.52832 C 10.446533 10.851559 10.367921 10.41919 10.210693 10.231201 C 10.053466 10.043212 9.74927 9.935547 9.298096 9.908203 L 9.298096 9.528809 Z"
                fill="currentColor"
              />
            </g>
          </svg>
        </button>
        <div class="toolbar-separator"></div>
        <button
          aria-keyshortcuts="Alt+M"
          aria-label="Show sidebar menu"
          class="toolbar-button"
          data-action="show-overflow-menu"
          id="toolbar-overflow"
          tabindex="0"
        >
          <svg
            xmlns="http://www.w3.org/2000/svg"
            width="32"
            height="32"
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="2"
            stroke-linecap="round"
            stroke-linejoin="round"
            class="feather feather-menu"
          >
            <line x1="3" y1="12" x2="21" y2="12"></line>
            <line x1="3" y1="6" x2="21" y2="6"></line>
            <line x1="3" y1="18" x2="21" y2="18"></line>
          </svg>
        </button>
      </header>

      <header id="mainwin-statusbar">
        <span>Show</span>
        <select id="filter-mode">
          <option value="all">All</option>
          <option value="active">Active</option>
          <option value="downloading">Downloading</option>
          <option value="seeding">Seeding</option>
          <option value="paused">Paused</option>
          <option value="finished">Finished</option>
        </select>
        <select id="filter-tracker"></select>
        <input type="search" id="torrent-search" placeholder="Filter" />
        <span id="filter-count">&nbsp;</span>
        <span class="flexible-space"></span>
        <div class="speed-container">
          <div id="speed-dn-label"></div>
          <div id="speed-dn-icon">
            <svg
              xmlns="http://www.w3.org/2000/svg"
              width="32"
              height="32"
              viewBox="0 0 24 24"
              fill="none"
              stroke="currentColor"
              stroke-width="2"
              stroke-linecap="round"
              stroke-linejoin="round"
              class="feather feather-chevron-down"
            >
              <polyline points="6 9 12 15 18 9"></polyline>
            </svg>
          </div>
        </div>
        <div class="speed-container">
          <span class="flexible-space"></span>
          <div id="speed-up-label"></div>
          <div id="speed-up-icon">
            <svg
              xmlns="http://www.w3.org/2000/svg"
              width="32"
              height="32"
              viewBox="0 0 24 24"
              fill="none"
              stroke="currentColor"
              stroke-width="2"
              stroke-linecap="round"
              stroke-linejoin="round"
              class="feather feather-chevron-up"
            >
              <polyline points="18 15 12 9 6 15"></polyline>
            </svg>
          </div>
        </div>
      </header>

      <main id="mainwin-workarea">
        <div id="torrent-container">
          <ul class="flex" id="torrent-list"></ul>
        </div>
      </main>

      <div class="upload-div">
        <h2>Drag your torrent files here to add them to Transmission.</h2>
      </div>
    </div>
  </body>
</html>
